/**
 * 开发环境Webpack配置
 */
const baseConfig = require('./base');
const path = require('path');
// const webpack = require('webpack');
// 额外处理所需组件
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const LiveReloadPlugin = require('webpack-livereload-plugin');

const multi = require('./multi.conf.js');
// 遍历得到入口文件
const tpls = [];
for (const [key, val] of Object.entries(multi)) {
  const { tpl, vendor, chunks = [] } = val;
  // 是否需要加载公共文件
  if (vendor) {
    chunks.unshift('vendor');
  }
  chunks.unshift(key);
  tpls.push(new HtmlWebpackPlugin({
    template: path.join(baseConfig.dir.sourcePath, tpl),
    filename: path.join(baseConfig.dir.view, tpl),
    inject: true,
    chunks,
  }));
}

const option = {
  output: {
    path: baseConfig.dir.publicPath,
    publicPath: '/',
    filename: 'scripts/[name].bundle.js', // 文件输出，name 的值为入口属性名称
  },
};
const plugins = [
  ...baseConfig.basePlugins,
  /*new webpack.LoaderOptionsPlugin({
    options: {}
  }),*/
  // 多页处理
  ...tpls,
  new LiveReloadPlugin({
    appendScriptTag: true,
  }),
  // 样式文件输出
  new ExtractTextPlugin('styles/[name].css'),
];

const options = Object.assign(option, baseConfig.dev);
/*, {
  devServer:{
    hot: true,
    open: true,
    host: 'localhost', //可选，ip
    port: 3000, //可选，端口
    contentBase:path.resolve(__dirname,'dist'), //可选，基本目录结构
    compress: true, //可选，压缩
    proxy: {}
    proxy: {
        '/api': {
            target: 'http://localhost:8081',
            pathRewrite: {'^/api': '/data'} //本来是反向代理去http://localhost:8081/api，rewrite之后就反向代理去http://localhost:8081/data
        }
    }
  }
}*/

options.plugins = plugins;

module.exports = options;
